<!--
*  2021-03-15
*  成品详情明细
-->
<template>
  <div id="app" class="product-detail">
    <!-- 头部导航 -->
    <van-nav-bar
      ref="header"
      :title="title"
      left-arrow
      @click-left="onClickLeft"
      left-text="返回"
    >
      <template #right>
        <span @click="onClickRight"><van-icon name="plus" size="20" /></span>
      </template>
    </van-nav-bar>
    <!-- 滚动 -->
    <better-scroll
      class="public-scroll"
      :data="tableData"
      :totalPage="totalPage"
    >
      <van-cell-group v-show="tableData.length !== 0">
        <van-swipe-cell v-for="(data, index) in tableData" :key="index">
          <van-cell :title="data.topNo" :value="data.color"></van-cell>
          <van-cell
            title="成品匹号"
            :value="data.designSeqNo"
          ></van-cell>
          <van-cell title="成品缸号" :value="data.dyeSeqNo"></van-cell>
          <van-cell title="成品长度" :value="data.length"></van-cell>
          <van-cell title="成品重量" :value="data.weight"></van-cell>
          <van-cell title="成品幅宽" :value="data.width"></van-cell>
        </van-swipe-cell>
      </van-cell-group>
      <van-empty
        class="custom-image"
        image="https://img01.yzcdn.cn/vant/custom-empty-image.png"
        v-show="tableData.length === 0"
        description="暂无数据"
      />
    </better-scroll>
  </div>
</template>

<script>
import { comeBack } from "@/utils/index";
import {
  getClothNoteScan,
} from "@/api/product";

export default {
  name: "productDetail",
  data() {
    return {
      title: "成品详情明细",
      totalPage: 1,
      tableData: [],
      topNo: "",
      show: false,
      columns: [],
    };
  },
  mounted() {
    const that = this;
    if (process.env.NODE_ENV === "production") {
      this.$nextTick(() => {
        that.initFn(that);
      });
    } else {
      window.apiready = function () {
        that.initFn(that);
      };
    }
  },
  methods: {
    //初始化
    initFn(that) {
      that.onClickRight();
      window.api.addEventListener({
        name:'viewdisappear'
      }, function() {
        window.api.closeWin();
      });
    },
    // 返回
    onClickLeft() {
      comeBack();
    },
    // 扫码
    onClickRight() {
      const that = this;
      that.tableData = [];
      const zyHmsScan = api.require('zyHmsScan');
      zyHmsScan.openDefaultView({}, ret => {
        if(ret.status) {
          let content = ret.result;
          let index = content.indexOf("flag");
          let flag = index != -1 ? 1 : "";
          let params = {};
          if (flag) {
            let lastIndex = content.lastIndexOf("/");
            let lastIndex2 = content.indexOf("?");
            params.geryClothId = content.slice(lastIndex + 1, lastIndex2);
            params.flag = flag;
          } else {
            let lastIndex = content.lastIndexOf("/");
            params.geryClothId = content.slice(lastIndex + 1, content.length);
          }
          getClothNoteScan(params, (res) => {
            that.tableData.push(res);
          });
        }
      });
    },
  },
};
</script>

<style lang="scss">
.product-detail {
  width: 100%;
  height: 100%;
  .public-scroll {
    width: 100%;
    height: calc(100vh - 44px);
    overflow: hidden;
  }
}
</style>
